<!DOCTYPE HTML>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Admin-Page</title>
    <link rel="stylesheet" href="/static/css/index.css">
    <link rel="stylesheet" href="/static/css/image.css">
    <link rel="stylesheet" href="/static/css/admin.css">
    <link rel="stylesheet" href="/static/css/subCase.css">
    <script type="text/javascript" src="/static/js/admin.js"></script>
    <script type="text/javascript" src="/static/js/index.js"></script>
    <script type="text/javascript" src="/static/js/base.js"></script>


</head>
<style>
    .name_style {
        height: 30px;
        margin: 5px;
        font-size: 16px;
    }

    .research_input {
        width: 200px;
        display: none;
    }

    .research_input input {
        float: left;
        width: 150px;
        height: 40px;
        margin-top: 2.5px;
    }
</style>
<script>
    function showRearch() {
        let resInp = document.getElementById("res_input");
        let res = document.getElementById("res")
        resInp.style['display'] = "block"
        res.style["display"] = "none"
    }

    function showImagePage(i) {
        let imageShowDiv = document.getElementById(i);
        console.log(imageShowDiv)
        imageShowDiv.style['display'] = 'block';
    }

    function closeImagePage(i) {
        let imageShowDiv = document.getElementById(i);
        imageShowDiv.style['display'] = 'none';
    }

    let currentcaseImgDiv = "";

    function showImageSub(i, b) {
        currentcaseImgDiv = b
        let imageShowDiv = document.getElementById(i);
        console.log(imageShowDiv)
        imageShowDiv.style['display'] = 'block';
    }

    function closeImageSub(i) {
        let imageShowDiv = document.getElementById(i);
        imageShowDiv.style['display'] = 'none';
    }


    function selectImg() {
        let checked = document.getElementsByName("checked");
        let number = 0;
        let current = "";
        for (let i = 0; i < checked.length; i++) {
            if (checked[i].checked) {
                current = checked[i];
                number++;
            }
        }
        if (number > 1) {
            for (let i = 0; i < checked.length; i++) {
                checked[i].checked = false
            }
            alert("只可以选择一个数据");
        } else {
            let imageSelected = document.getElementById("image" + current.id);
            let img1 = document.getElementById("img-head");
            img1.src = imageSelected.src;
            document.getElementById("img").value = current.id;
            document.getElementById("imageShowDiv").style['display'] = "none";
        }
    }

    function subAddImg() {
        let checked = document.getElementsByName("subchecked");
        let number = 0;
        let current = "";
        for (let i = 0; i < checked.length; i++) {
            if (checked[i].checked) {
                current = checked[i];
                number++;
            }
        }
        if (number > 1) {
            for (let i = 0; i < checked.length; i++) {
                checked[i].checked = false
            }
            alert("只可以选择一个数据");
        } else {
            let imageSelected = document.getElementById("image" + current.id);
            let des = document.getElementById(currentcaseImgDiv);
            let image = document.createElement("img")
            image.width = 798;
            image.height = 600;
            image.src = imageSelected.src;
            image.name = imageSelected.id;
            des.appendChild(image);
            document.getElementById("imageShow-Sub").style['display'] = "none";
        }


    }


</script>

<body>

<div class="header">
    <div class="topBar" onmouseleave="closePersonContr(); closeSearch()">
        <a onmouseover="sider()" style="cursor: pointer">
            <img src="../static/img/icon/file.svg" width="50px" height="64px"
                 style="float: left;background-color: #ff6a00">
        </a>
        <div class="mainMenu">
            <a href="/" class="menuList">
                首页
            </a>
            <a href="/baseKnowledge" class="menuList">软工概述</a>
            <a href="/getSubCase" class="menuList">子案例</a>
            <a href="/getCompleteCase" class="menuList">完整案例</a>
        </div>

        <div class="research" id="res">
            <div class="showResearch"></div>
            <div class="researchIcon" onmouseover="showRearch()">搜索</div>
        </div>
        <div class="research research_input" id="res_input">
            <input type="text">
            <a href="">
                <div style="float: right; width: 32px;height:32px;margin-top:8px;margin-right: 5px;
        background-image: url('/static/img/icon/search.svg');background-repeat: no-repeat"
                ></div>
            </a>
        </div>

        <div class="loginInfo">
            {{if .user}}
                <div id="user" style="margin-right: 50px" onmouseenter="showPersonContr()">{{.user.Name}}</div>
            {{else}}
                <a href="/login">登录</a>
                <a href="/register" class="register">立即注册</a>
            {{end}}
            <div id="personShow">
                {{if .user}}
                    {{if ne .user.Level "1"}}
                        <a href="/admin" style="width:80px;">管理员</a>
                    {{end}}
                    <a href="/exit" style="width: 80px; ">个人信息</a>
                    <a href="/exit" style="width: 80px;">退出</a>
                {{end}}
            </div>


        </div>
    </div>
</div>
<div id="topDiv">
    <div id="t_left">
        <div class="userInf">
            个人信息
            <div id="userInfShow">
                <div style="width: 100px;height: 100px; margin: auto">
                    <img src="/{{.headImg.Path}}"
                         style="width: 100px;height: 100px;border-radius: 5px;">
                </div>
                <span>Name：{{.user.Name}}</span> <br>
                <span>Role：{{.user.Role}}</span> <br>

            </div>
        </div>
        <div class="l1">
            <span class="l1_list" onclick="knowledgeDivShow('s_k')">
                 <span style="width: 50px;height: 41px;display: inline-block">
                    <img src="../static/img/icon/knowledge.svg" style="margin-left: 12.5px; vertical-align: middle">
                </span>
                <span style="width: 108px; height: 40px;display: inline-block">软工知识</span>

            </span>
            <span class="l1_list" onclick="knowledgeDivShow('s_c')">
                <span style="width: 50px;height: 41px;display: inline-block">
                    <img src="../static/img/icon/subCase.svg" style="margin-left: 12.5px; vertical-align: middle">
                </span>
                <span style="width: 108px; height: 40px;display: inline-block">子案例</span>
            </span>
            <span class="l1_list" onclick="knowledgeDivShow('c_c')">
                <span style="width: 50px;height: 41px;display: inline-block">
                    <img src="../static/img/icon/completeCase.svg" style="margin-left: 12.5px; vertical-align: middle">
                </span>
                <span style="width: 108px; height: 40px;display: inline-block">完整案例</span>
            </span>
            <span class="l1_list" onclick="knowledgeDivShow('p_i')">
                <span style="width: 50px;height: 41px;display: inline-block">
                    <img src="../static/img/icon/changeInf.svg" style="margin-left: 12.5px; vertical-align: middle">
                </span>
                <span style="width: 108px; height: 40px;display: inline-block">信息修改</span>
            </span>
        </div>
        <div class="l2">
            <span style="width: 158px;height: 41px;line-height: 41px">
                <span style="width: 25px;height: 41px;display: inline-block">
                    <img src="../static/img/icon/tool.svg" style="margin-left: 12.5px; vertical-align: middle">
                </span>
                <span style="width: 80px; height: 40px;display: inline-block">工具应用</span>
                <span style="width: 40px; height: 40px;display: inline-block">订阅</span>
            </span>
        </div>
    </div>
    <div id="t_right">
        <div style="position: relative; left: 1387px;cursor: pointer;" onclick="sider()">
            <img src="/static/img/icon/fork.svg" width="20" style="vertical-align: middle">
        </div>
        <div id="s_k" class="right_content" style="display: block">
            <div class="s_k_left">
                <div onclick="showSource('uploadFile')" class="uploadFileShow">
                    上传文件
                </div>
                <div onclick="showSource('showFile')" class="uploadFileShow">
                    文件列表
                </div>
                <div onclick="showSource('showImage')" class="uploadFileShow">
                    图片列表
                </div>
                <div onclick="showSource('showVideo')" class="uploadFileShow">
                    视屏列表
                </div>
                <div class="uploadFileShow">
                    <a href="/admin/book" style="text-decoration: none; color: black">Book Edit</a>
                </div>
            </div>
            <div class="s_k_right">
                <div id="uploadFile"
                     style="display: none;width: 340px;height: 150px;margin-top: 50px;margin-left: 230px">
                    <div class="fileSelect-model">
                        <!-- 中心上传按钮@click='batchUpload' -->
                        <form method="POST" enctype="multipart/form-data" action="/upFile">
                            <input name="myfile" type="file" id="batchUpload" multiple="multiple">
                            <input type="submit" value="确定" class="uploadSubmit">
                        </form>
                        <div onclick="centerUploadBox()" class="centerUploadBox">
                            <div class="uploadBut">
                                <div class="centerUpload"></div>
                                <div class="uploadChar">上传</div>
                            </div>
                        </div>
                        <div class="fileList">
                        </div>
                    </div>
                </div>
                <div id="showFile"
                     style="height: 500px;width: 900px;display: none;background-color: #bcd2c0;float: left;">
                    <table border="1px">
                        <tr>
                            <th align="center" valign="middle">Id</th>
                            <th align="center" valign="middle">Uid</th>
                            <th align="center" valign="middle">Title</th>
                            <th align="center" valign="middle">Content</th>
                            <th align="center" valign="middle">Deploy</th>
                            <th align="center" valign="middle">Operation</th>
                        </tr>
                        {{range $article :=.as}}
                            <tr>
                                <td align="center" valign="middle">{{$article.Id}}</td>
                                <td align="center" valign="middle">{{$article.Uid}}</td>
                                <td align="center" valign="middle">{{$article.Title}}</td>
                                <td align="center" valign="middle">{{$article.Content}}</td>
                                <td align="center" valign="middle"><a
                                            href="/admin/deployArticle?articleId={{$article.Id}}">{{$article.Deploy}}</a>
                                </td>
                                <td align="center" valign="middle">
                                    <button name="编辑"><a href="">Edit</a></button>
                                    <button name="删除"
                                            onclick="confirmDelete('/admin/deleteArticle?article={{$article.Id}}')">
                                        Delete
                                    </button>
                                    <button name="查看"><a href="/admin/articleShow?article={{$article.Id}}">Check</a>
                                    </button>
                                </td>
                            </tr>
                        {{end}}

                    </table>
                </div>
                <div id="showImage"
                     style="height: 500px;width: 900px;display: none;float: left;">
                    <!--相册-->
                    <div id="albums">
                        {{range $image :=.images}}
                            <a href="/admin/showImage?path={{$image.Path}}">
                                <div class="smallpicshow">
                                    <div class="smallpicshow_zoom">
                                        <img class="smallpic" src="/{{$image.Path}}">
                                    </div>
                                </div>
                            </a>
                        {{end}}
                    </div>
                </div>
                <div id="showVideo" style="height: 500px;width: 900px;display: block;float: left;">
                    <div style="width: 810px;height: 400px;overflow: auto;margin-top: 50px;margin-left: 50px; ">
                        {{range $video := .videos}}
                            <div style="width:200px;height: 150px;float: left;margin-left:30px;margin-top: 10px;margin-bottom: 10px "
                                 onmouseover="showVideoName({{$video.Id}})"
                                 onmouseleave="closeVideoName({{$video.Id}})">
                                <div style="width: 200px;height: 100px;background-color: #85b995;">

                                    <video src="/{{$video.Path}}" width="200px">
                                    </video>
                                </div>
                                <br>
                                <div style="width: 200px;height: 50px">
                                    <button>重命名</button>
                                    <button onclick="confirmDelete('/admin/deleteVideo?video={{$video.Id}}')">删除
                                    </button>
                                </div>
                                <div id="videoName{{$video.Id}}"
                                     style="width:200px;height:40px;background-color: black; position: relative; z-index: 99;opacity: 0.6; top: -97px;display: none">
                                    {{$video.Name}}
                                    <a href="/admin/playVideo?videoPath={{$video.Path}}"
                                       style="color: white;text-decoration: none">
                                        <div>播放</div>
                                    </a>
                                </div>
                            </div>

                        {{end}}
                    </div>
                </div>
            </div>

        </div>
        <div id="s_c" class="right_content" style="display: none">
            <div class="bigBox">
                <div class="leftBox">
                    <div class="dt">子案例
                        <input class="addSub" type="button" value="添加案例" onclick="display_right('addContent')">
                    </div>
                    <div class="dd">
                        <ul>
                            {{range $subcase := .subcases}}
                                <li id="case1" class="case">
                                    {{$subcase.Id}}. &emsp;<span id="case{{$subcase.Id}}Name"> {{$subcase.Name}}</span>
                                    <ul class="current" id="subOne">
                                        <li onclick="showContent1('1','index{{$subcase.Id}}')">案例简介</li>
                                        <li onclick="showContent1('2','index{{$subcase.Id}}')">技术准备</li>
                                        <li onclick="showContent1('3','index{{$subcase.Id}}')">开发流程</li>
                                        <li onclick="showContent1('4','index{{$subcase.Id}}')">界面展示</li>
                                        <li>

                                            {{if eq $subcase.Display 1}}
                                                <a href="/admin/revokeSubcase?subcaseId={{$subcase.Id}}"
                                                   style="text-decoration: none;color: black"> 撤销案例</a>
                                            {{else}}
                                                <a href="/admin/releaseSubcase?subcaseId={{$subcase.Id}}"
                                                   style="text-decoration: none;color: black">发布案例</a>
                                            {{end}}

                                        </li>
                                        <li onclick="SubmitSure('{{$subcase.Id}}')">提交</li>
                                        <li onclick="remove('remove1')">删除</li>
                                    </ul>
                                </li>

                            {{end}}

                        </ul>
                    </div>
                </div>
                <div class="rightBox">
                    <div id="addContent" style="display: none" onmouseleave="leave()">
                        <form action="/admin/addSubcaseByName" method="post">
                            <input class="addContent" placeholder="请输入案例名" name="casename"><br>
                            <div class="c-d-div">
                                <input class="submit cancel" type="submit" value="确定">
                                <input class="cancel" type="reset" value="取消" onclick="closeDiv('addContent')">
                            </div>
                        </form>
                    </div>
                    {{range $subcase := .subcases}}
                        <div class="leftContent index{{$subcase.Id}}" style="display: none">
                            <textarea class="edit" id="case{{$subcase.Id}}-textarea1">{{$subcase.Abstract}}</textarea>
                            <input class="reset" type="reset" value="重置"
                                   onclick="resetTexrarea('case{{$subcase.Id}}-textarea1')">
                        </div>
                        <div class="leftContent index{{$subcase.Id}}" style="display: none;">
                            <textarea class="edit"
                                      id="case{{$subcase.Id}}-textarea2">{{$subcase.TechPrepare}}</textarea>
                            <input class="reset" type="button" value="重置"
                                   onclick="resetTexrarea('case{{$subcase.Id}}-textarea2')">
                        </div>
                        <div class="leftContent index{{$subcase.Id}}" style="display: none">
                            <textarea class="edit" id="case{{$subcase.Id}}-textarea3">{{$subcase.Process}}</textarea>
                            <input class="reset" type="reset" value="重置"
                                   onclick="resetTexrarea('case{{$subcase.Id}}-textarea3')">
                        </div>
                        <div class="leftContent index{{$subcase.Id}}" style=" display: none">
                            <div id="case{{$subcase.Id}}-img"
                                 style="position:relative;top: 20px;width: 798px;height:350px;overflow: auto;border: gray solid 1px">
                                {{range $index,$subImg := $.subImgPat}}
                                    {{if eq $index $subcase.Id}}
                                        {{range $path := $subImg}}
                                            <img src="/{{$path}}">
                                        {{end}}
                                    {{end}}
                                {{end}}
                            </div>
                            <button onclick=" showImageSub('imageShow-Sub','case{{$subcase.Id}}-img')" style="position:
                            relative; left: 700px; top: 20px;">添加图片
                            </button>
                        </div>

                    {{end}}
                </div>
            </div>


            <div id="imageShow-Sub"
                 style=" width:150px;height: 300px;position: relative;bottom: 1450px;left: 1232px ;border: #666666 solid 1px; display: none">
                <div style="width: 150px;height:300px;overflow: auto">
                    {{range $image := .images}}
                        <label for="{{$image.Id}}">
                            <img id="image{{$image.Id}}" class="imgSel" src="/{{$image.Path}}" height="100"
                                 width="100"
                                 name="">
                        </label>
                        <input type="checkbox" id="{{$image.Id}}" name="subchecked">
                    {{end}}
                </div>
                <button id="b_select1" onclick="subAddImg()" style="position:relative;top: 5px;">确定</button>
                <button id="b_cancel" onclick="closeImagePage('imageShow_Sub')"
                        style="position:relative;left: 50px;top: 5px">取消
                </button>
            </div>

        </div>
        <div id="c_c" class="right_content" style="display: none">
            <div class="bigBox">


                <div class="leftBox">
                    <div class="dt">完整案例
                        <input class="addSub" type="button" value="添加案例" onclick="display_right('addComContent')">
                    </div>
                    <div class="dd">
                        <ul>
                            {{range $subcase := .subcases}}
                                <li id="case1" class="case">
                                    {{$subcase.Id}}. &emsp;<span id="case{{$subcase.Id}}Name"> {{$subcase.Name}}</span>
                                    <ul class="current" id="subOne">
                                        <li onclick="showContent1('1','ComIndex{{$subcase.Id}}')">案例简介</li>
                                        <li onclick="showContent1('2','ComIndex{{$subcase.Id}}')">技术准备</li>
                                        <li onclick="showContent1('3','ComIndex{{$subcase.Id}}')">开发流程</li>
                                        <li onclick="showContent1('4','ComIndex{{$subcase.Id}}')">界面展示</li>
                                        <li onclick="showContent1('5','ComIndex{{$subcase.Id}}')">视频教程</li>
                                        <li>

                                            {{if eq $subcase.Display 1}}
                                                <a href="/admin/revokeSubcase?subcaseId={{$subcase.Id}}"
                                                   style="text-decoration: none;color: black"> 撤销案例</a>
                                            {{else}}
                                                <a href="/admin/releaseSubcase?subcaseId={{$subcase.Id}}"
                                                   style="text-decoration: none;color: black">发布案例</a>
                                            {{end}}

                                        </li>
                                        <li onclick="SubmitSure('{{$subcase.Id}}')">提交</li>
                                        <li onclick="remove('remove1')">删除</li>
                                    </ul>
                                </li>

                            {{end}}

                        </ul>
                    </div>
                </div>
                <div class="rightBox">
                    <div id="addComContent" style="display: none" onmouseleave="leave()">
                        <form action="/admin/addSubcaseByName" method="post">
                            <input class="addContent" placeholder="请输入案例名" name="casename"><br>
                            <div class="c-d-div">
                                <input class="submit cancel" type="submit" value="确定">
                                <input class="cancel" type="reset" value="取消" onclick="closeDiv('addContent')">
                            </div>
                        </form>
                    </div>
                    {{range $subcase := .subcases}}
                        <div class="leftContent ComIndex{{$subcase.Id}}" style="display: none">
                            <textarea class="edit" id="case{{$subcase.Id}}-textarea1">{{$subcase.Abstract}}</textarea>
                            <input class="reset" type="reset" value="重置"
                                   onclick="resetTexrarea('case{{$subcase.Id}}-textarea1')">
                        </div>
                        <div class="leftContent ComIndex{{$subcase.Id}}" style="display: none;">
                            <textarea class="edit"
                                      id="case{{$subcase.Id}}-textarea2">{{$subcase.TechPrepare}}</textarea>
                            <input class="reset" type="button" value="重置"
                                   onclick="resetTexrarea('case{{$subcase.Id}}-textarea2')">
                        </div>
                        <div class="leftContent ComIndex{{$subcase.Id}}" style="display: none">
                            <textarea class="edit" id="case{{$subcase.Id}}-textarea3">{{$subcase.Process}}</textarea>
                            <input class="reset" type="reset" value="重置"
                                   onclick="resetTexrarea('case{{$subcase.Id}}-textarea3')">
                        </div>
                        <div class="leftContent ComIndex{{$subcase.Id}}" style=" display: none">
                            <div id="case{{$subcase.Id}}-img"
                                 style="position:relative;top: 20px;width: 798px;height:350px;overflow: auto;border: gray solid 1px">
                                {{range $index,$subImg := $.subImgPat}}
                                    {{if eq $index $subcase.Id}}
                                        {{range $path := $subImg}}
                                            <img src="/{{$path}}">
                                        {{end}}
                                    {{end}}
                                {{end}}
                            </div>
                            <button onclick=" showImageSub('imageShow-Sub','case{{$subcase.Id}}-img')" style="position:
                            relative; left: 700px; top: 20px;">添加图片
                            </button>
                        </div>
                        <div class="leftContent ComIndex{{$subcase.Id}}"
                             style=" display: none; margin-left: 0px;margin-top: 10px;width: 700px;background-color: #7ac23c">
                            {{template "/modle/video_list.html"}}
                            <div class="videoListContainer" style="background-color: #7ac23c">
                                <div class="" style="height: 50px;">
                                    视频列表
                                </div>
                                <form  action="/admin/releaseVideo" method="post">
                                    <div style="width: 380px;height:400px;overflow: auto;border: gray solid 1px">
                                        <ul class="list-box">
                                            {{range $video := $.videos}}
                                            <li class="video_list" onmouseover="showVideoInfor('v{{$video.Id}}')"
                                                onmouseleave="closeVideoInfor('v{{$video.Id}}')">
                                                <span class="page-num">{{$video.Id}}</span>
                                                <span class="part" onclick="playVideo('{{$video.Path}}','{{$video.Poster}}');pauseVid()">{{$video.Name}}</span>
                                                <span class="videoTime">{{formatVideoTime $video.Duration}}</span>
                                                <input class="videoCheck" type="checkbox" value="video{{$video.Id}}" name="videoCheckBox"
                                                       style="top: -80px;left: 160px;width: 20px;height: 20px">
                                                <div class="list_float" id="v{{$video.Id}}">{{$video.Name}}</div>
                                            </li>

                                            {{end}}

                                        </ul>
                                    </div>
                                    <div id="videoListButton">
                                        <button type="button" onclick="selectAll()" >全选</button>
                                        <button type="button" onclick="cancelSelect()">取消</button>
                                        <button type="submit">发布</button>
                                        <button type="button">撤销</button>
                                    </div>
                                </form>
                            </div>

                            <div>

                            </div>
                        </div>

                    {{end}}
                </div>
            </div>
        </div>
        <div id="p_i" class="right_content" style="display: none">
            <div id="showFile01"
                 style="height: 500px;width: 800px;background: azure;float: left; margin-left: 300px">
                <div style="width: 400px;height: 400px;margin: auto;text-align: center;border: #666666 solid 1px">
                    <h3>个人信息修改</h3>
                    <br>
                    <img id="img-head" src="{{.headImg.Path}}" height="100px" width="100px">
                    <button onclick="showImagePage('imageShowDiv')">更改</button>
                    <form action="/admin/updateInformation" method="post">
                        <label for="name">姓名：<input id="name" class="name_style" type="text" name="name"
                                                    value="{{.user.Name}}"></label> <br>
                        <label for="pwd">密码：<input id="pwd" class="name_style" type="text" name="pwd"
                                                   value="{{.user.Pwd}}"></label> <br>
                        <label for="role">角色：<input id="role" class="name_style" type="text" name="role"
                                                    value="{{.user.Role}}"></label> <br>
                        <label for="img">头像：<input id="img" class="name_style" type="text" name="imgId"
                                                   value="{{.user.ImgId}}"></label> <br>
                        <button type="submit">提交</button>
                    </form>
                </div>
                <div id="imageShowDiv"
                     style=" width:150px;height: 300px;position: relative;top:-400px;left: 605px;border: #666666 solid 1px;display: none">
                    <div style="width: 150px;height:300px;overflow: auto">
                        {{range $image := .images}}
                            <label for="{{$image.Id}}">
                                <img id="image{{$image.Id}}" class="imgSel" src="/{{$image.Path}}" height="100"
                                     width="100"
                                     name="">
                            </label>
                            <input type="checkbox" id="{{$image.Id}}" name="checked">
                        {{end}}
                    </div>
                    <button id="b_select1" onclick="selectImg()" style="position:relative;top: 5px;">确定</button>
                    <button id="b_cancel" onclick="closeImagePage('imageShowDiv')"
                            style="position:relative;left: 50px;top: 5px">取消
                    </button>
                </div>
            </div>
        </div>
    </div>
    <div id="container">

    </div>
</div>
{{template "/modle/form-model.html"}}
<style>
    .videoListContainer {
        width: 400px;
        height: 520px;
        position: relative;
        top: -520px;
        left: 702px;
        text-align: center;
    }

    .list-box {
        position: relative;
        top: -45px;
        list-style-type: none;
        padding-left: 0px;


    }

    .video_list {
        height: 30px;
        margin-top: 1px;
        background-color: #85b995;
        list-style: none;


    }

    .list_float {
        position: relative;
        top: -80px;
        left: -20px;
        width: 280px;
        height: 20px;
        display: none;
        line-height: 20px;
        font-size: 4px;
        background-color: gray;
        color: white;
        text-align: left;
        z-index: 9999999;
    }


    .page-num {
        width: 20px;
        height: 30px;
        position: relative;
        left: -100px;
        display: block;
        font-size: smaller;
        font-size: 14px;
    }

    .part {
        width: 160px;
        height: 30px;
        position: relative;
        left: -70px;
        top: -30px;
        display: block;
        font-size: 14px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .videoTime {
        width: 60px;
        height: 30px;
        position: relative;
        left: 100px;
        top: -60px;
        font-size: smaller;
        display: block;
        font-size: 14px;
    }
    .videoCheck{
        width: 60px;
        height: 30px;
        position: relative;
        left: 100px;
        top: -60px;
        font-size: smaller;
        display: block;
        font-size: 14px;
    }

    #videoListButton {
        width: 280px;
        height: 20px;
        background-color: #666666;
    }


</style>
<script>
    function showVideoInfor(id) {
        let float = document.getElementById(id);
        float.style['display'] = "block";
    }

    function closeVideoInfor(id) {
        let float = document.getElementById(id);
        float.style['display'] = "none";
    }
    function selectAll() {
       let checkList = document.getElementsByName("videoCheckBox");
       for (let i=0;i<checkList.length;i++){
           checkList[i].checked = true;
       }
    }
    function cancelSelect() {
        let checkList = document.getElementsByName("videoCheckBox");
        for (let i=0;i<checkList.length;i++){
            checkList[i].checked = false;
        }

    }

</script>
<script type="text/javascript" src="/static/js/comCase.js"></script>
<script type="text/javascript" src="/static/js/subCase.js"></script>
</body>
</html>